<extend name="./public/frame.html"/>
<block name="content">
    <blockquote class="layui-elem-quote search">
        <div class="layui-input-inline">
            <input type="text" class="layui-input" id="admin_name" placeholder="管理员名称">
        </div>
        <div class="layui-input-inline">
            <input type="text" class="layui-input date" readonly id="start" placeholder="加入时间-起">
        </div>
        <div class="layui-input-inline">
            <input type="text" class="layui-input date" readonly id="end" placeholder="加入时间-止">
        </div>
        <div class="layui-input-inline">
            <select id="role" class="layui-input" style="width: 150px;">
                <option value="">角色名称</option>
                <volist name="roles" id="role">
                    <option value="{$key}">{$role}</option>
                </volist>
            </select>
        </div>
        <div class="layui-input-inline">
            <button class="layui-btn" data-type="search">搜索</button>
            <button class="layui-btn layui-btn-warm" data-type="add">添加管理员</button>
        </div>
    </blockquote>
    <table class="layui-table" lay-data="{width:'auto', height:'auto', url:'{$url}', page: true, limit: 10, id:'admin'}"
           lay-filter="admin">
        <thead>
        <tr>
            <th lay-data="{checkbox:true, fixed: true}"></th>
            <th lay-data="{field:'admin_id', width:80, fixed: true,align:'center'}">ID</th>
            <th lay-data="{field:'user_name', width:150,align:'center'}">管理员名称</th>
            <th lay-data="{field:'role', width:200,align:'center' }">所属角色</th>
            <th lay-data="{field:'add_time', width:200,align:'center'}">加入时间</th>
            <th lay-data="{field:'their_name', width:200,align:'center'}">运力名称</th>
            <th lay-data="{fixed:'right', toolbar: '#barDemo', width:150, align:'center'}">操作</th>
        </tr>
        </thead>
    </table>

    <script type="text/html" id="barDemo">
        {{#if(d.admin_id>1){}}
        <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
        {{#}else{}}
        <a class="layui-btn layui-btn-disabled layui-btn-xs">编辑</a>
        <a class="layui-btn layui-btn-disabled layui-btn-xs">删除</a>
        {{#}}}
    </script>
    <script>

        layui.use(['table','laydate'], function () {
            var table = layui.table;
            var laydate = layui.laydate;
            lay('.date').each(function(){
                laydate.render({
                    elem: this
                    ,type: 'date'
                    ,trigger: 'click'
                });
            });
            //监听工具条
            table.on('tool(admin)', function (obj) {
                var data = obj.data; //获得当前行数据
                var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
                var id = data.admin_id;
                if (layEvent === 'del') {
                    if(id=="{$self}"){
                        layer.alert("您无法删除自己的信息",{icon:2});
                        return false
                    }
                    layer.confirm('确定删除吗?',{icon:3}, function (index) {
                        var url = "{:url('adminDel')}";
                        $.post(url, {'act': 'del','admin_id': id}, function (res) {
                            switch (res['status']){
                                case 1:
                                    obj.del();
                                    break;
                                default:
                                    layer.alert(res['msg'],{icon: 5});
                                    break;
                            }
                        }, 'json');
                        layer.close(index);
                    });
                }
                else if(layEvent === 'edit'){
                    if(id=="{$self}"){
                        layer.alert("您无法编辑自己的信息",{icon:2});
                        return false
                    }
                    layer.open({
                        type: 2,
                        title: '编辑'+data.user_name+'的属性',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['100%', '100%'],
                        content: '{:url("/admin/admin/admin_info","admin_id=")}' + id, //iframe的url
                        cancel: function (index, layero) {
                            table.reload('admin', "{$url}");
                        }
                    });
                }
            });
            var $ = layui.jquery, active = {
                search: function () {
                    var start = $('#start').val();
                    var end = $('#end').val();
                    var role = $('#role').val();
                    var admin_name = $('#admin_name').val();
                    table.reload('admin', {
                        url: '/admin/admin/search',
                        where: {
                            role: role,
                            start: start,
                            end: end,
                            admin_name:admin_name
                        } //设定异步数据接口的额外参数
                    });
                }
                , add: function () {
                    layer.open({
                        type: 2,
                        title: $(this).text(),
                        shadeClose: true,
                        shade: 0.8,
                        area: ['100%', '100%'],
                        content: '{:url("/admin/admin/admin_info")}', //iframe的url
                        cancel: function (index, layero) {
                            table.reload('admin', {url: "{$url}"});
                        }
                    });
                }
            };
            $('.layui-btn').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });
        });
    </script>
</block>
